<template>
  <div class="hezi">
    <div class="form">
      <el-input v-model="username" placeholder="请输入员工账号" class="name"></el-input>
      <el-input placeholder="请输入员工密码" v-model="password" show-password @keyup.enter.native="enter"></el-input>
      <el-row>
        <el-button type="primary" class="but" @click="buts">登陆</el-button>
      </el-row>
    </div>

  </div>
</template>

<script>
  export default {
    data() {
      return {
        username: "",
        password: ""
      };
    },
    methods: {
      buts() {
        if (!this.username || !this.password) {
          this.$message.error("员工账号或者密码错误");
        }

      this.fasong();
      },
      enter: function(e) {
        var keyCode = window.event ? e.keyCode : e.whith
        if (keyCode == 13) {
         this.fasong()
        }
      },


      fasong(){
        this.$axios({
          url: "/login",
          method: "post",
          data: {
            username: this.username,
            password: this.password
          }
        }).then(res => {
          // if(res.data.statusCode=='401'){
          //       alert('账号不存在')
          //    }
          if (res.data.statusCode=='401') {
            alert(res.data.message)
          } else{
            if (res.data.message == "登录成功") {
              // console.log(res);
              localStorage.setItem("token", res.data.data.token);
              localStorage.setItem("user", JSON.stringify(res.data.data.user));
              this.$router.push("/home");
          }
        }});
      }
    },


  };
</script>
<style lang="less" scoped>
  html {
    background-color: red !important;

  }

  .hezi {
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: pink;

    //   margin: 280px auto;
    .form {
      width: 400px;
      height: 300px;
    }

    .name {
      margin-bottom: 30px;
    }

    .but {
      margin-top: 60px;
      margin-right: 142px;
      width: 100%;
    }

  }
</style>
